<template>
  <div id="app">
    <div class="item"></div>
    <!-- <flex-direction-t></flex-direction-t> -->
    <!-- <to-do-list></to-do-list>
    <flex-top-t-vue></flex-top-t-vue>
    <flex-grow></flex-grow>
    <align-items-t></align-items-t>
     <flex-center></flex-center>
    <flex-top-menu></flex-top-menu>-->
    <!-- <relative></relative>
    <absolute></absolute>
    <absolute-center></absolute-center>
    <tubiaoVue></tubiaoVue>
    <fixed></fixed>-->
    <!-- <top-menu></top-menu>     -->
    <!-- <simple-button-slot-0 :title="按钮点击"></simple-button-slot-0> -->
    <!-- <simple-button-slot>按钮点击</simple-button-slot> -->
    <!-- <simple-button-slot-2 @click="as()">按钮点击</simple-button-slot-2> -->

    <!-- <todo-list-1></todo-list-1> -->
    <!-- <review-bind-class></review-bind-class> -->
    <!-- <index2></index2> -->
    <!-- <spliteModelVue></spliteModelVue> -->
    <!-- <my-input v-model="inputVal" :clearable="true" icon="icon-yanjing"></my-input> -->

    <!-- <my-buttonbase v-model="inputVal" clearable></my-buttonbase> -->
    <!-- <i class="iconfont icon-sousuo_o"></i> -->
    <!-- <SimpleTable>     </SimpleTable> -->
    <!-- <myDialog></myDialog> -->
    <!-- <SimpleDialog></SimpleDialog>  -->
    <!-- <article-list></article-list> -->
    <!-- <articleListBase></articleListBase> -->
    <!-- <myDialogBase></myDialogBase> -->
    <!-- <transition-base></transition-base>
    <transition></transition> -->
    <!-- <keyframes-base></keyframes-base>
<keyframes></keyframes> -->
    <!-- <my-switch-template></my-switch-template> -->
    <!-- <my-switch-animation></my-switch-animation> -->

    <!-- <transition-input></transition-input>
<life></life> -->
    <!-- <index></index> -->
    <!-- <article-list-mock></article-list-mock> -->
    <MockTest></MockTest>

    {{ inputVal }}
  </div>
</template>
<script>
import AlignItemsT from "./views/lesson5/align-items-t.vue";
import FlexCenter from "./views/lesson5/flex-center.vue";
import FlexDirectionT from "./views/lesson4/flex-direction-t.vue";
import FlexGrow from "./views/lesson5/flex-grow.vue";
import flexTopTVue from "./views/lesson5/flex-top-t.vue";
import FlexTopMenu from "./views/lesson5/flex-topMenu.vue";
import Relative from "./views/lesson6/relative.vue";
import toDoList from "./views/lesson4/toDoList.vue";
import AboutView from "./views/AboutView.vue";
import Absolute from "./views/lesson6/absolute.vue";
import AbsoluteCenter from "./views/lesson6/absolute-center.vue";
import tubiaoVue from "./views/lesson6/tubiao.vue";
import Fixed from "./views/lesson6/fixed.vue";
import TopMenu from "./views/lesson6/topMenu.vue";
import SimpleButtonSlot2 from "./views/lesson7/SimpleButtonSlot2.vue";
import SimpleButtonSlot0 from "./views/lesson7/SimpleButtonSlot0.vue";
import SimpleButtonSlot from "./views/lesson7/SimpleButtonSlot.vue";
import TodoList1 from "./views/lesson7/TodoList1.vue";
import reviewBindClass from "./views/lesson8/reviewBindClass.vue";
import index2 from "./views/lesson8/index2.vue";
import spliteModelVue from "./views/lesson9/spliteModel.vue";
import myInput from "./views/lesson9/myInput.vue";
import myButtonbase from "./views/lesson9/myButton-base.vue";
import SimpleTable from "./views/lesson10/SimpleTable.vue";
import myDialog from "./views/lesson10/myDialog.vue";
import SimpleDialog from "./views/lesson10/SimpleDialog.vue";
import ArticleList from "./views/lesson10/articleList.vue";
import articleListBase from "./views/lesson11/articleListBase.vue";
import myDialogBase from "./views/lesson11/myDialogBase.vue";
import TransitionBase from "./views/lesson13/transition-base.vue";
import Transition from "./views/lesson13/transition.vue";
import KeyframesBase from "./views/lesson13/keyframes-base.vue";
import Keyframes from "./views/lesson13/keyframes.vue";
import MySwitchTemplate from "./views/lesson13/mySwitch-template.vue";
import MySwitchAnimation from "./views/lesson13/mySwitch-animation.vue";
import TransitionInput from "./views/lesson15/transitionInput.vue";
import Life from "./views/lesson15/life.vue";
import index from "./views/lesson15/index.vue";
import ArticleListMock from "./views/lesson16/articleList-mock.vue";
import MockTest from "./views/lesson16/mock-test.vue";

export default {
  components: {
    toDoList,
    FlexDirectionT,
    flexTopTVue,
    FlexGrow,
    AlignItemsT,
    FlexCenter,
    FlexTopMenu,
    Relative,
    AboutView,
    Absolute,
    AbsoluteCenter,
    tubiaoVue,
    Fixed,
    TopMenu,
    SimpleButtonSlot2,
    SimpleButtonSlot0,
    SimpleButtonSlot,
    TodoList1,
    reviewBindClass,
    index2,
    spliteModelVue,
    myInput,
    myButtonbase,
    SimpleTable,
    myDialog,
    SimpleDialog,
    ArticleList,
    articleListBase,
    myDialogBase,
    TransitionBase,
    Transition,
    KeyframesBase,
    Keyframes,
    MySwitchTemplate,
    MySwitchAnimation,
    TransitionInput,
    Life,
    index,
    ArticleListMock,
    MockTest,
  },
  data() {
    return { inputVal: "" };
  },
  methods: {
    as() {
      alert("111111");
    },
  },
};
</script>
<style>
</style>